<!-- 传说芭蕉扇乃铁扇公主唾液所化，因此可重复取 -->
<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
  <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
  <script type="text/javascript" src="lib/js/ionic.bundle.min.js"></script>

</head>

<body>

  <div ng-app="myApp" ng-controller="control">
    <input type="text" set-Focus ng-blur="setBlur()" value="">
    <button ng-click="getFocus()">孙爷爷我要去取芭蕉扇了</button>
    <p style="font-size:16px;">使用px</p>
    <p style="font-size:1em;">使用EM</p>
  </div>

  <script type="text/javascript">
    //模型
    var app = angular.module('myApp', []);

    //控制器
    app.controller("control", function ($scope) {
      $scope.ctrlScope = $scope;
      $scope.isCome = false;  //判断大圣来了没
      $scope.isFocus = false;  //判断是不是要取芭蕉扇
      $scope.getFocus = function () {
        $scope.isFocus = true; //大圣来了
        $scope.isCome = true; //要取芭蕉扇
        $scoep.settleVipNu += "1";
      };

      $scope.setBlur = function () {
        $scope.isFocus = false;//没人要来取芭蕉扇了
      }
    });

    //自定义指令
    app.directive('setFocus', [function () {
      return {
        scope: false,
        link: function (scope, element) {
          scope.$watch("isFocus", function (newValue, oldValue, scope) {
            //大圣来了，且要取芭蕉扇
            if (newValue && scope.isCome) {
              element[0].focus(); //获取焦点
            }
          }, true);;
        }
      };
    }]);

  </script>
</body>

</html>